<template>
  <div>
    <nut-popup position="bottom" closeable round :custom-style="{ padding: '30px 0' }" v-model:visible="show">
      <div p-36rpx pb-10rpx>
        <div font-bold>快递公司</div>
        <div my-40rpx>
          <nut-radio-group direction="horizontal" v-model="chooseExpress">
            <nut-radio v-for="(item, index) in expressList" :key="index" shape="button" :label="item.id" size="large">{{
              item.name }}</nut-radio>
          </nut-radio-group>
        </div>
        <div pt-40rpx>
          <nut-button block type="primary" @click="submit" :loading="props.loading">提交</nut-button>
        </div>
      </div>
    </nut-popup>
  </div>
</template>

<script setup lang="ts">
import { getLogistics } from '@/api/address';
const show = ref<boolean>(false)
const expressList = ref<any>([])
const chooseExpress = ref<any>('')
const props = defineProps<{
  loading: boolean
}>()


const emit = defineEmits(['click'])
async function init() {
  const res = await getLogistics();
  if (res.data.success) {
    expressList.value = res.data.result
  }
}

defineExpose({
  show,
})
const submit = async () => {
  if (!chooseExpress.value) {
    uni.showToast({
      title: '请选择物流地址',
      icon: "none"
    })
  } else {
    emit('click', expressList.value.find((item: any) => item.id == chooseExpress.value))
  }
}
onMounted(() => {
  init()
})



</script>

<style scoped>
</style>
